<!DOCTYPE html>
<html lang="en-us">
<head>
    <meta charset="utf-8" />
    <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/diff2html/bundles/css/diff2html.min.css" />
    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/diff2html/bundles/js/diff2html-ui.min.js"></script>
    <title>contrastReport</title>
</head>
<script>
    const diffString = `${diffString}`;

    document.addEventListener('DOMContentLoaded', function () {
        const targetElement = document.getElementById('diffElement');
        const configuration = {
            drawFileList: true,
            fileListToggle: true,
            fileListStartVisible: true,
            fileContentToggle: true,
            matching: 'lines',
            outputFormat: 'side-by-side',
            synchronisedScroll: true,
            highlight: true,
            renderNothingWhenEmpty: true,
        };
        const diff2htmlUi = new Diff2HtmlUI(targetElement, diffString, configuration);
        diff2htmlUi.draw();
        diff2htmlUi.highlightCode();
    });
</script>
<body>
<div id="diffElement"></div>
</body>
</html>